<html>
<head>
<script src="../rosy.js" type="text/javascript"></script>
<script type="text/javascript">
var frame = new Frame();
frame.startFrame();
function start(){
	var div1 = new FrameElement('div1');
	div1.setX(0);
	div1.setY(0);
	div1.onEnterFrame = function(){
		this.setX(this.getX() + 5);
		this.setY(this.getY() + 5);
		if(this.getX() >= 200){
			this.onEnterFrame = null;
		}
	}

	var div2 = new FrameElement('div2');
	div2.setX(200);
	div2.setY(200);
	div2.onEnterFrame = function(){
		this.setX(this.getX() - 5);
		this.setY(this.getY() - 5);
		if(this.getX() <= 0){
			this.onEnterFrame = null;
		}
	}
	frame.setObject(div1);
	frame.setObject(div2);
}
</script>
</head>
<body onload="start();">
<div id="base" style="position:absolute;width:310px;height:310px;border:1px solid #999999;top:50px;left:50px">
<div id="div1" style="height:100px;width:100px;position:absolute;background-color:#999999;"></div>
<div id="div2" style="height:100px;width:100px;position:absolute;background-color:#666666;"></div>
<pre style="position:absolute;top:50px;left:400px">
var frame = new Frame();
frame.startFrame();
function start(){
	var div1 = new FrameElement('div1');
	div1.setX(0);
	div1.setY(0);
	div1.onEnterFrame = function(){
		this.setX(this.getX() + 5);
		this.setY(this.getY() + 5);
		if(this.getX() >= 200){
			this.onEnterFrame = null;
		}
	}

	var div2 = new FrameElement('div2');
	div2.setX(200);
	div2.setY(200);
	div2.onEnterFrame = function(){
		this.setX(this.getX() - 5);
		this.setY(this.getY() - 5);
		if(this.getX() <= 0){
			this.onEnterFrame = null;
		}
	}
	frame.setObject(div1);
	frame.setObject(div2);
}
</pre>
</div>
</body>
</html>